<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets">
    <h:head>
        <title>Facelet Title</title>
    </h:head>

    <h:body>

        <ui:composition template="/template/common/commonLayout.xhtml">                

            <ui:define name="content">

                <!--<p:layout style="min-height:200px; max-width: fit-content; padding-left: 50px; padding-right: 50px; padding-top: 5px; padding-bottom: 25px;">-->


                <p:layoutUnit position="center">


                    <h:form id="campaignForm" enctype="multipart/form-data">

                        <div align="center">
                            
                            <p:panelGrid columns="1" styleClass="mainTitleBox">
                                <h:outputText value="Crear Campaña" styleClass="mainTitle"/>
                            </p:panelGrid>

                            <p:panelGrid columns="3" columnClasses="nothing, nothing, noBorderColumn" styleClass="showTable">                            

                                <h:outputText value="Nombre Campaña"/>
                                <p:inputText value="#{CampaignBean.campaign.name}" 
                                             style="width: 327px" 
                                             id="inputName" 
                                             maxlength="50"
                                             required="true"/>
                                <p:message for="inputName" showDetail="false" showSummary="true"/>

                                <h:outputText value="Descripción Campaña"/>
                                <p:inputText value="#{CampaignBean.campaign.description}" 
                                             style="width: 327px" 
                                             required="true" 
                                             maxlength="80" 
                                             id="inputDescription"/>                    
                                <p:message for="inputDescription" showDetail="false" showSummary="true"/>


                                <h:outputText value="Cargar Archivo imagen campaña"/>
                                <p:fileUpload value="#{CampaignBean.file}"
                                              mode="simple"
                                              disabled="false"
                                              auto="true"
                                              required="true"
                                              id="inputFile"/>
                                <p:message for="inputFile" showDetail="false" showSummary="true"/>

                            </p:panelGrid>

                            <p:growl id="growl" life="5000"/>

                            <p:panelGrid columns="2" styleClass="saveButtons"> 
                                
                                <p:commandButton value="Guardar" 
                                                 id="ajax" 
                                                 ajax="false"
                                                 update="growl"
                                                 actionListener="#{CampaignBean.saveButton}"/>
                                <p:commandButton value="Cancelar"
                                                 immediate="true"
                                                 action="#{CampaignBean.cancelButton}"/>

                            </p:panelGrid>


                        </div>


                    </h:form>


                </p:layoutUnit>

                <!--</p:layout>-->


            </ui:define>

        </ui:composition>

    </h:body>
</html>